<template>
	<view class="">
		<!-- 导航 start-->
		<view class="is-nav-order has-bg-white has-pd-10">
			<view class="is-nav-li is-center" @tap="getnav(0)" :class="nav_now==0 ? 'is-blue' : 'is-grey'">
				全部
			</view>
			<view class="is-nav-li is-center" @tap="getnav(1)" :class="nav_now==1 ? 'is-blue' : 'is-grey'">
				已完成
			</view>
			<view class="is-nav-li is-center" @tap="getnav(2)" :class="nav_now==2 ? 'is-blue' : 'is-grey'">
				已关闭
			</view>
		</view>	
		<!-- 导航 end-->
		<!-- 订单 start-->
		<view class="all-order has-pdlr-20">
			<view class="order-list has-pdt-20" v-for="(item,index) in list" :key="index">
				<view class="has-floatl  order-list-left">
					<image :src="item.ma_type_img" mode=""></image>
				</view>
				<view class="has-floatl order-list-center">				
					<view class="">
						<text>{{item.ma_type_tit}}</text>
						<text class="has-pdl-10">+{{item.total_fee_true}}</text>
					</view>
					<view class="is-grey is-size-12">
						<text>单号:</text>
						<text>{{item.order_no}}</text>
					</view>
					<view class="is-grey is-size-12">
						<text>{{item.grab_time}}</text>
					</view>
				</view>
				<view class="has-floatl order-list-right is-right" @tap="grabinfo(item.id,1)">
					<view v-show="item.grab_stauts == 1" class="is-blue">已完成</view>
					<view v-show="item.grab_stauts == 0" class="is-red">待付款</view>
					<view v-show="item.grab_stauts == 2" class="is-grey">已关闭</view>
					<view class="has-pdt-20 has-pdt-30">
						<text class="is-blue">收益:</text>
						<text v-show="item.grab_stauts == 1" class="is-blue">{{item.income}}DC</text>
						<text v-show="item.grab_stauts == 0 || item.grab_stauts == 2" class="is-blue">0.00DC</text>
						<image src="../../static/img/common/right_ico_grey.png" mode="" class="right_ico has-floatr"></image>
					</view>
				</view>
			</view>
			<view style="flex: 1;">
				<uni-err-box  :errType="errType" :errText="errText" ></uni-err-box>
			</view>
			<view style="flex: 1;">
				<uni-load-more  :loadingType="loadingType" :contentText="contentText" ></uni-load-more>
			</view>
		</view>
		<!-- 订单 end-->
	</view>
</template>

<script>
	import uniLoadMore from '@/components/load-more.vue';
	import uniErrBox from '@/components/err-box.vue';
	var _self,
		page = 1,
		timer = null;
	export default {
		components: {
			uniLoadMore,
			uniErrBox
		},
		data(){
			return {
				errType: 0,
				errText: '',
				loadingText: '加载中...',
				loadingType: 0,//定义加载方式 0---contentdown  1---contentrefresh 2---contentnomore
				contentText: {
					contentdown:'上拉显示更多',
					contentrefresh: '正在加载...',
					contentnomore: '没有更多了'
				},
				foxtoken:'',
				nav_now:0,
				list:[]
			}
		},
		onLoad() {
			_self = this;
			let info = this.service.getfox();
			if(info[0]){
				//console.log(info[0])				
				this.foxtoken = info[0]['foxtoken'];
				//uni.clearStorageSync();
				uni.request({
					url: this.service.FOX_URL + 'diamond/get_userinfo_order',
					method:'POST',
					data: {
						user_key: this.foxtoken
					},
					dataType:'json',
					header:{
						'content-type':'application/x-www-form-urlencoded',
					},
					success: res => {
						// var rest = JSON.stringify(res);
						// console.log(res)
						var rest = res.data;
						if(rest.status == 'success'){
							this.userinfo = rest.msg;
							this.ma_lock = this.userinfo['ma_lock'];
							// console.log(this.userinfo)
						}else if(rest.status == 'error'){
							uni.showToast({
								title:rest.msg,
								icon:'none',
								mask:true
							})
						}else{
							uni.showToast({
								title:rest.msg,
								icon:'none',
								mask:true
							})
						}
					}
				})
			}else{
				uni.reLaunch({
					url:'../logon/login'
				})
			}
			this.getnav(0);
		},
		//下拉刷新
		onPullDownRefresh: function() {
			this.getList();
		},
		// 加载更多
		onReachBottom : function(){
			if (timer != null) {
				clearTimeout(timer);
			}
			timer = setTimeout(function() {
				_self.getmore();
			}, 1000);
		},
		methods:{
			getnav(nav){
				this.nav_now = nav;
				this.list = [];
				this.errType = 0;
				this.getList();
			},
			// 数据和分页是模拟的实际也是这样写
			getmore: function(){
				if (_self.loadingType !== 0) {//loadingType!=0;直接返回
					return false;
				}
				_self.loadingType = 1;
				uni.showNavigationBarLoading();//显示加载动画
				uni.request({
					url: this.service.FOX_URL + 'diamond/mygrab_list',
					method:'POST',
					data: {
						page:page,
						limit:10,
						user_key: this.foxtoken,
						type:this.nav_now
					},
					dataType:'json',
					header:{
						'content-type':'application/x-www-form-urlencoded'
					},
					success: res => {
						var foxmsg = res.data;
						if (foxmsg.data.list == null  || foxmsg.data.list.length==0) {//没有数据
							_self.loadingType = 2;
							uni.hideNavigationBarLoading();//关闭加载动画
							return;
						}
						page++;//每触底一次 page +1
						_self.list = _self.list.concat(foxmsg.data.list);//将数据拼接在一起
						_self.loadingType = 0;//将loadingType归0重置
						uni.hideNavigationBarLoading();//关闭加载动画
					},
					complete: res => {
						uni.hideLoading();
						uni.stopPullDownRefresh();
					}
				});
			},
			getList: function() {//第一次回去数据
				page = 1;
				this.loadingType = 0;
				uni.showNavigationBarLoading();
				uni.request({
					url: this.service.FOX_URL + 'diamond/mygrab_list',
					method:'POST',
					data:{
						page:page,
						limit:10,
						user_key: this.foxtoken,
						type:this.nav_now
					},
					dataType:'json',
					header:{
						'content-type':'application/x-www-form-urlencoded'
					},
					success: res => {
						page++;//得到数据之后page+1
						var foxmsg = res.data;
						// console.log(foxmsg)
						if (foxmsg.code == 200) {                    
							_self.list = foxmsg.data.list;
							if (foxmsg.data.list.length > 0 && foxmsg.data.list.length < 10) {//没有数据
								_self.loadingType = 5;
								uni.hideNavigationBarLoading();//关闭加载动画
								return;
							}
							if (foxmsg.data.list.length == 0) {
								_self.errType = 1;
								_self.loadingType = 4;
								uni.hideNavigationBarLoading();//关闭加载动画
								return;
							}
							uni.hideNavigationBarLoading();
							uni.stopPullDownRefresh();//得到数据后停止下拉刷新
						}else{
							_self.errType = 1;
							_self.loadingType = 4;
							uni.hideNavigationBarLoading();//关闭加载动画
							return;
						}                         
					}
				});
			},
			grabinfo(id,t){
				uni.navigateTo({
					url:'/pages/index/orderdo?id='+id+'&showback='+t
				})
			}
		}
	}
</script>

<style>
	.is-nav-order .is-nav-li{
		width: 33%;
		display: inline-block;
	}
	.order-list{
		border-bottom: 1px solid #aaa;
		height: 160rpx;
	}
	.order-list-left{
		width:8%;
		line-height: 160rpx;
		padding-right: 2%;
	}
	.order-list-center{
		width:50%;
		line-height: 50rpx;
	}
	.order-list-right{
		width:40%;
	}
	.order-list-left image{
		width:60rpx;
		height: 60rpx;
	}
	.right_ico{
		width:40rpx;
		height: 40rpx;
	}
</style>
